<template>
 <div>
     <Card :bordered="false" dis-hover>
      <Form inline class="ivu-mb">
            <FormItem class="ivu-mb-0">
      <RadioGroup v-model="patientDate" type="button">
            <Radio label="today">日</Radio>
            <Radio label="week">周</Radio>
            <Radio label="month">月</Radio>
        </RadioGroup>
        </FormItem>
        <FormItem class="ivu-mb-0">
        <DatePicker type="daterange" v-width="'100%'" placeholder="日期选择" />
        </FormItem>
        </Form>
     <div class="tit"><Icon type="md-bookmark" />总就诊</div>
    <Table :columns="columns1" :data="data1" :loading="loading" border show-summary :summary-method="handleSummary1" class="ivu-mb-16"></Table>
    <div class="tit"><Icon type="md-bookmark" />初诊</div>
    <Table :columns="columns1" :data="data1" :loading="loading" border show-summary :summary-method="handleSummary1" class="ivu-mb-16"></Table>
     <div class="tit"><Icon type="md-bookmark" />复诊</div>
    <Table :columns="columns1" :data="data1" :loading="loading" border show-summary :summary-method="handleSummary1" class="ivu-mb-16"></Table>
            </Card>
    </div>
</template>
 <script>
    export default {
        name: 'consume',
        data () {
            return {
                loading: false,
                date: '',
                patientDate: 'today',
                columns1: [
                    {
                        title: '诊室',
                        key: 'room',
                        align: 'center',
                        fixed: 'left',
                        width: 80
                    },
                    {
                        title: '总消费',
                        key: 'totalConsumption',
                        align: 'center',
                        width: 100
                    },
                    {
                        title: '消费人数',
                        key: 'consumptionPerson',
                        align: 'center',
                        width: 100
                    },
                    {
                        title: '人均消费',
                        key: 'perCapita',
                        align: 'center',
                        width: 100
                    },
                    {
                        title: '业绩占比',
                        key: 'proportion',
                        align: 'center',
                        width: 100
                    },
                    {
                        title: '药品',
                        align: 'center',
                        children: [
                            {
                                title: '人均',
                                key: 'drugsPreCapita',
                                align: 'center',
                                width: 100
                            },
                            {
                                title: '消费',
                                key: 'drugsConsumption',
                                width: 100
                            },
                            {
                                title: '比例',
                                key: 'drugsProportion',
                                width: 100
                            }
                        ]
                    },
                    {
                        title: '308',
                        align: 'center',
                        children: [
                            {
                                title: '人均',
                                key: 'TPreCapita',
                                align: 'center',
                                width: 100
                            },
                            {
                                title: '消费',
                                key: 'TConsumption',
                                width: 100
                            },
                            {
                                title: '比例',
                                key: 'TProportion',
                                width: 100
                            }
                        ]
                    },
                    {
                        title: '治疗',
                        align: 'center',
                        children: [
                            {
                                title: '人均',
                                key: 'treatmentPreCapita',
                                align: 'center',
                                width: 100
                            },
                            {
                                title: '消费',
                                key: 'treatmentConsupmtion',
                                width: 100
                            },
                            {
                                title: '比例',
                                key: 'tratmentProportion',
                                width: 100
                            }
                        ]
                    },
                    {
                        title: '其它',
                        align: 'center',
                        children: [
                            {
                                title: '人均',
                                key: 'hospitalizationPreCapita',
                                align: 'center',
                                width: 100
                            },
                            {
                                title: '消费',
                                key: 'hospitalizationConsupmtion',
                                width: 100
                            },
                            {
                                title: '比例',
                                key: 'hospitalizationProportion',
                                width: 100
                            }
                        ]
                    }
                    // {
                    //     title: '留观',
                    //     align: 'center',
                    //     children: [
                    //         {
                    //             title: '人均',
                    //             key: 'observePerCapita',
                    //             align: 'center',
                    //             width: 100
                    //         },
                    //         {
                    //             title: '消费',
                    //             key: 'observeConsupmtion',
                    //             width: 100
                    //         },
                    //         {
                    //             title: '比例',
                    //             key: 'observeProportion',
                    //             width: 100
                    //         }
                    //     ]
                    // }
                ],
                data1: []

            }
        },
        mounted () {
            const data = [];
            for (let i = 1; i < 5; i++) {
                data.push({
                    key: i,
                    room: i + '诊',
                    totalConsumption: Math.round(Math.random() * 10000),
                    consumptionPerson: Math.round(Math.random() * 50),
                    perCapita: Math.round(Math.random() * 1000),
                    proportion: Math.round(Math.random() * 50) + '%',
                    drugsConsumption: Math.round(Math.random() * 10000),
                    drugsPreCapita: Math.round(Math.random() * 1000),
                    drugsProportion: Math.round(Math.random() * 50) + '%',
                    TConsumption: Math.round(Math.random() * 10000),
                    TPreCapita: Math.round(Math.random() * 1000),
                    TProportion: Math.round(Math.random() * 50) + '%',
                    treatmentPreCapita: Math.round(Math.random() * 1000),
                    treatmentConsupmtion: Math.round(Math.random() * 10000),
                    tratmentProportion: Math.round(Math.random() * 50) + '%',
                    hospitalizationPreCapita: Math.round(Math.random() * 1000),
                    hospitalizationConsupmtion: Math.round(Math.random() * 10000),
                    hospitalizationProportion: Math.round(Math.random() * 50) + '%'
                    // observePerCapita: Math.round(Math.random() * 1000),
                    // observeConsupmtion: Math.round(Math.random() * 10000),
                    // observeProportion: Math.round(Math.random() * 50) + '%'

                });
            }
            this.data1 = data;
        },
        methods: {
            handleSummary ({ columns, data }) {
                const sums = {};
                columns.forEach((column, index) => {
                    const key = column.key;
                    if (index === 0) {
                        sums[key] = {
                            key,
                            value: '汇总'
                        };
                        return;
                    }
                    const values = data.map(item => Number(item[key]));
                    if (!values.every(value => isNaN(value))) {
                        const v = values.reduce((prev, curr) => {
                            const value = Number(curr);
                            if (!isNaN(value)) {
                                return prev + curr;
                            } else {
                                return prev;
                            }
                        }, 0);
                        sums[key] = {
                            key,
                            value: v
                        };
                    } else {
                        sums[key] = {
                            key,
                            value: 'N/A'
                        };
                    }
                });
                return sums;
            },
            handleSummary1 ({ columns, data }) {
                const sums = {};
                columns.forEach((column, index) => {
                    const key = column.key;
                    if (index === 0) {
                        sums[key] = {
                            key,
                            value: '汇总'
                        };
                        return;
                    }
                    const values = data.map(item => Number(item[key]));
                    if (!values.every(value => isNaN(value))) {
                        const v = values.reduce((prev, curr) => {
                            const value = Number(curr);
                            if (!isNaN(value)) {
                                return prev + curr;
                            } else {
                                return prev;
                            }
                        }, 0);
                        sums[key] = {
                            key,
                            value: v
                        };
                    } else {
                        sums[key] = {
                            key,
                            value: 'N/A'
                        };
                    }
                });
                return sums;
            }
        }
    }
</script>
